/* pages/index/index.wxss */
.page_item {
  background-color: white;
  margin-bottom: -72rpx;
}
.flex_column_c {
  display: flex;
  flex-direction: column;
  align-items: center;
}
/* 首页 */
.banner_swiper {
  text-align: center;
  width: 100%;
  height: 300rpx;
}
.banner_image {
  width: 100%;
  height: 100%;
  display: block;
}

.index_title_bg {
  position: absolute;
  left: 0;
  right: 0;
  width: 750rpx;
  height: 490rpx;
}

.banner_image {
  width: 694rpx;
  height: 300rpx;
}

.index_menu_container {
  margin: 0 28rpx;
}
.index_menu {
  flex: 1;
}

.action_container {
  box-sizing: border-box;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 0 28rpx;
}

.action_item {
  width: calc(50% - 20rpx);
  margin: 0 10rpx;
  aspect-ratio: 324/144;
  border-radius: 16rpx;
}

.action_item:nth-child(n + 3) {
  margin-top: 20rpx;
}

.index_menu_text {
  font-size: 24rpx;
  color: #333333;
  margin-top: 16rpx;
}

.title_container {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin: 30rpx 21rpx;
}

.title_container_text {
  margin-left: 12rpx;
  color: #333333;
  font-weight: bold;
  font-size: 36rpx;
  flex: 1;
}

.title_container_text_icon {
  width: 48rpx;
  height: 48rpx;
}

.title_container_more {
  color: #999999;
  font-size: 28rpx;
  margin-right: 8rpx;
}

.title_container_more_icon {
  width: 16rpx;
  height: 16rpx;
}

.horizontal_scroller {
  white-space: nowrap;
}

.scroller_item {
  width: 256rpx;
  height: 330rpx;
  overflow: hidden;
  display: inline-block;
  position: relative;
  margin: 0 0 0 28rpx;
  border-radius: 16rpx;
  box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(0, 0, 0, 0.1);
}

.scroller_item:nth-last-child(1) {
  margin: 0 28rpx 0 28rpx;
}

.shop_flow {
  padding: 0 28rpx;
  column-gap: 22rpx;
  column-count: 2;
  margin: 20rpx 0;
}

.shop_flow_item {
  width: calc(100% - 0);
  break-inside: avoid;
  border-radius: 10rpx;
  margin: 0 0;
}

.shop_title {
  color: #333333;
  margin: 20rpx 16rpx 0 16rpx;
  font-size: 28rpx;
  font-weight: bold;
}

.shop_title_single {
  color: #333333;
  margin: 20rpx 16rpx 0 16rpx;
  font-size: 28rpx;
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.shop_desc {
  margin: 16rpx 16rpx 0 16rpx;
  margin-top: 8rpx;
}

.null_wrap {
  height: 30rpx;
}

.shop_tag_container {
  position: absolute;
  left: 24rpx;
  right: 24rpx;
  bottom: 16rpx;
  height: 46rpx;
  line-height: 46rpx;
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
  --tag-primary-color: #f08302;
  --tag-border-radius: 12rpx 12rpx 12rpx 0;
  --tag-padding: 2rpx 12rpx;
  --tag-font-size: 20rpx;
}

van-tag + van-tag {
  margin-left: 12rpx;
}

/* 文化 */
.culture_text {
  margin: 0 24rpx;
  box-sizing: border-box;
  font-size: 36rpx;
  color: #333333;
  line-height: 64rpx;
}

.parent_title_container {
  height: 100rpx;
  padding: 0 24rpx;
  display: flex;
  align-items: center;
}

.parent_title {
  flex: 1;
  color: #333333;
  font-size: 36rpx;
  font-weight: bold;
}

.all {
  color: #999999;
  font-size: 28rpx;
}

.cultrue_scroller {
  white-space: nowrap;
}

.cultrue_scroller_item {
  width: 642rpx;
  height: 360rpx;
  display: inline-block;
  position: relative;
  margin: 0 0 0 28rpx;
  border-radius: 16rpx;
  box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(0, 0, 0, 0.1);
}

.cultrue_scroller_item:nth-last-child(1) {
  margin: 0 28rpx 0 28rpx;
}

.cultrue_grid {
  --grid-item-content-background-color: transparent;
  --grid-item-content-padding: 0 0;
  margin: 0 18rpx;
  padding: 0 0 21rpx 0;
}

.play_icon {
  position: absolute;
  width: 96rpx;
  height: 96rpx;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.cultrue_message {
  display: flex;
  flex-direction: row;
  margin: 80rpx 24rpx 122rpx 24rpx;
  box-sizing: border-box;
  border-radius: 16rpx;
  background-color: #f6f7f9;
  padding: 38rpx 24rpx;
  color: #333333;
  font-size: 24rpx;
}

/* 消息 */
.message_bg {
  height: 100%;
  background-color: #f6f7f9;
}

.message_item {
  width: 702rpx;
  background-color: white;
  border-radius: 24rpx;
  margin: 24rpx auto;
  display: flex;
  padding: 32rpx;
  flex-direction: row;
  align-items: center;
  box-sizing: border-box;
}

.message_content {
  color: #333333;
  font-size: 36rpx;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.messgae_time {
  color: #999999;
  font-size: 28rpx;
  margin-top: 12rpx;
}

/* 个人中心 */
.person-bg {
  position: absolute;
  width: 100%;
  height: 336rpx;
}

.avatar {
  position: absolute;
  margin-top: -20rpx;
  margin-left: 32rpx;
  border-radius: 70rpx;
  border: solid 10rpx white;
}

.person-main {
  position: relative;
  padding: 0rpx 24rpx;
  height: 1500rpx;
}

.person-cell {
  margin-bottom: 24rpx;
  background-color: white;
  border-radius: 20rpx;
}

.person-cell-title {
  margin: 40rpx 32rpx 40rpx 32rpx;
  font-weight: bolder;
  font-size: 36rpx;
  color: #333333;
}

.person-setting {
  height: 64rpx;
  display: flex;
  flex-direction: row-reverse;
}

.person-count-row {
  background-color: white;
  margin: 32rpx;
}

.person-count-container {
  padding-left: 16rpx;
  display: flex;
  flex-direction: row;
  font-size: 24rpx;
  color: #666666;
}

.person-row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.person-column {
  display: flex;
  flex-direction: column;
}

.person-grid {
  height: 134rpx;
}

.person-grid-item {
  width: 25%;
  align-self: center;
}

.person-grid-padding {
  --grid-item-content-padding: 12rpx;
}

.person-grid-item-title {
  text-align: center;
  color: #333333;
  font-size: 28rpx;
  margin: 20rpx 0 40rpx 0;
}
